<!DOCTYPE html>
<title>Clipboard: Pasting an image returns appropriate types</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<div>
  To try the test manually, right-click on the image > Copy Image,
  then click anywhere in the background of the main
  page and right-click > Paste.
</div>
<!--TODO (https://crbug.com/906276): Change this iframe node to an image node
  with alt text after an automated method to copy an image DOM object is
  created. Until then, this will be an iframe, as iframes can have their
  document run execCommand to copy, and will still expose most types. -->
<iframe id="src" alt="text" src="resources/mozilla.gif"></iframe>

<script>
async_test(t => {
  window.onload = () => {
    document.body.onpaste = t.step_func_done(event => {
      const expectedTypes = "file;image/png string;text/html";
      const actualTypes = [...event.clipboardData.items]
        .map(item => `${item.kind};${item.type}`)
        .sort()
        .join(' ');
      assert_equals(actualTypes, expectedTypes);
    });

    const srcElement = document.getElementById('src');
    srcElement.contentWindow.document.execCommand('copy');
    document.execCommand('paste');
  };
}, 'Clipboard data types when pasting image');
</script>
